<template>
    <div>
        <Collapse accordion  :simple="true">
            <Panel v-for="(item,index) of datalist" :key="index" :name="lists[index].id.toString()" :style="{position:'relative'}" >
                <span>{{lists[index].Name}}</span><Button type="info" @click.stop="addtwo(lists[index].id,2,1)"  style="position:absolute;right:32px;top:3px;">增加二级</Button>
                <div slot="content">
                    <Collapse accordion  :simple="true">
                        <Panel v-for="(item1,index1) of item" :key="index1" :name="item1.a.id.toString()" :hide-arrow="item1.b.length==0" :style="{position:'relative',border:'none'}">
                            <span>{{item1.a.Name}}</span>
                            <Button type="dashed" style="position:absolute;right:260px;top:3px;" >{{item1.a.Sort}}</Button>
                            <Button type="success"  style="position:absolute;right:176px;top:3px;" @click.stop="edit(item1.a.id,2,2)">修改</Button>
                            <Button type="warning"  style="position:absolute;right:82px;top:3px;" @click.stop="addtwo(item1.a.id,3,3)">增加三级</Button>
                            <Button type="error"  style="position:absolute;right:16px;top:3px;" @click.stop="del(item1.a.id)">删除</Button>
                            <div slot="content" v-if="item1.b.length>0">
                                <Collapse accordion  :simple="true">
                                    <Panel  v-for="(item2,index2) of item1.b" :key="index2" :name="item2.id.toString()" :hide-arrow="true" :style="{position:'relative'}">
                                        <span>{{item2.Name}}</span>
                                        <Button type="dashed" style="position:absolute;right:244px;top:3px;" >{{item2.Sort}}</Button>
                                        <Button type="success"  style="position:absolute;right:66px;top:3px;" @click.stop="edit(item2.id,3,4)">修改</Button>
                                        <Button type="error"  style="position:absolute;right:0;top:3px;" @click.stop="del(item2.id)">删除</Button>
                                    </Panel>
                                </Collapse>
                            </div>
                        </Panel>
                    </Collapse>
                </div>
            </Panel>
        </Collapse>
        <div>
            <Modal
                v-model="modal1"
                :title="changtitle"
                @on-ok="addtwosub">
                <Form ref="formCustom" :model="formCustom"  :label-width="80">
                    <FormItem label="名称" >
                        <Input type="text" v-model="formCustom.Name" />
                    </FormItem>
                    <FormItem label="排序">
                        <Select v-model="formCustom.Sort">
                            <Option :value="1">1</Option>
                            <Option :value="2">2</Option>
                            <Option :value="3">3</Option>
                            <Option :value="4">4</Option>
                            <Option :value="5">5</Option>
                            <Option :value="6">6</Option>
                            <Option :value="7">7</Option>
                            <Option :value="8">8</Option>
                            <Option :value="9">9</Option>
                        </Select>
                    </FormItem>
                    <FormItem label="展示样式">
                        <RadioGroup v-model="formCustom.Shows">
                            <Radio :label="0">简介</Radio>
                            <Radio :label="1">列表1(新闻类)</Radio>   
                            <Radio :label="2">列表2（左右）</Radio>
                            <Radio :label="3">列表3（上下）</Radio>
                        </RadioGroup>
                    </FormItem>
                    <FormItem label="是否导航栏显示">
                        <RadioGroup v-model="formCustom.IsIndex">
                            <Radio :label="0">不显示</Radio>
                            <Radio :label="1">显示</Radio>
                        </RadioGroup>
                    </FormItem>
                    <FormItem label="是否显示">
                        <RadioGroup v-model="formCustom.IsDisplay">
                            <Radio :label="0">不显示</Radio>
                            <Radio :label="1">显示</Radio>
                        </RadioGroup>
                    </FormItem>
                </Form>
            </Modal>
        </div>
    </div>
</template>
<script>
    export default {
        data () {
            return {
                value3: '1',
                value4: '1-1',
                modal1: false,
                formCustom:{
                    Name:'',
                    Sort:1,
                    Type:2,
                    FrId:7,
                    IsIndex:1,
                    IsDisplay:1,
                    Shows:1
                },
                changtitle:'添加二级',
                isdoti:1,
                lists:[
                    {Name:'中心概况',id:'7'},
                    {Name:'协同单位',id:'8'},
                    {Name:'分支机构',id:'9'},
                    {Name:'研究咨询',id:'10'},
                    {Name:'合作交流',id:'11'},
                    {Name:'科普文化',id:'12'},
                    {Name:'联系我们',id:'13'},
                ],
                datalist: [],
                onedata:{}
            }
        },
        methods: {
            edit(id,Type,isdoti){
                this.modal1 = true;
                this.isdoti=isdoti;
                if(this.isdoti ==2){ //修改2
                    this.changtitle='修改二级';
                }else if(this.isdoti ==4){ //修改3
                    this.changtitle='修改三级';
                }
                this.$axios.post('/admin/addlist/showone',{id:id}).then(res=>{
                    if(res.data.ret){
                        this.formCustom = res.data.data;
                    }
                })
            },
            addtwo(FrId,Type,isdoti){
                this.modal1 = true;
                this.formCustom.FrId = FrId;
                this.formCustom.Type = Type;
                this.isdoti=isdoti;
                if(this.isdoti ==1){  //添加2
                    this.changtitle='添加二级';
                }else if(this.isdoti ==2){ //修改2
                    this.changtitle='修改二级';
                }else if(this.isdoti ==3){ //添加3
                    this.changtitle='添加三级';
                }else if(this.isdoti ==4){ //修改3
                    this.changtitle='修改三级';
                }
            },
            addtwosub(){
                if(this.isdoti ==1){  //添加2
                    this.addlist()
                }else if(this.isdoti ==2){ //修改2
                    this.edittwo()
                }else if(this.isdoti ==3){ //添加3
                    this.addlist()
                }else if(this.isdoti ==4){ //修改3
                    this.edittwo()
                }
            },
            addlist(){
                this.$axios.post('/admin/addlist/addlist',{...this.formCustom}).then(res=>{
                        if(res.data.ret){
                            this.$Notice.success({
                                title: '新增成功'
                            })
                            this.isshow()
                            this.$emit('ee')
                        }else{
                            this.$Notice.success({
                                title: '新增失败'
                            })
                            return false;
                        }
                    })
            },
            edittwo(){
                this.$axios.post('/admin/addlist/update',{...this.formCustom}).then(res=>{
                    if(res.data.ret){
                        this.$Notice.success({
                            title: '修改成功'
                        })
                        this.isshow()
                        this.$emit('ee')
                    }else{
                        this.$Notice.success({
                            title: '修改失败'
                        })
                        return false;
                    }
                })
            },
            del(id){
                this.$axios.post('/admin/addlist/del',{id:id}).then(res=>{
                    if(res.data.ret){
                            this.$Notice.success({
                                title: '删除成功'
                            })
                            this.isshow()
                            this.$emit('ee')
                        }else{
                            this.$Notice.success({
                                title: '删除失败'
                            })
                            return false;
                        }
                })
            },
            isshow(){
                this.$axios.post('/admin/addlist/show').then(res=>{
                    if(res.data.ret){
                        this.datalist = res.data.data;
                    }
                })
            }
        },
        mounted() {
            var that = this;
            this.isshow()
        },
        watch: {
            modal1(){
                if(this.modal1){
                    if(this.isdoti==1||this.isdoti==2){
                        this.formCustom.name=''
                    }
                }
            }
        },
    }
</script>
<style lang="">
   
</style>